<template>
  <div class="app-container" v-loading="loading">
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane
        :label="item.weekDate"
        :name="index + ''"
        v-for="(item, index) in recordArr"
        :key="index"
      ></el-tab-pane>
    </el-tabs>
    <el-radio-group
      v-if="!loading"
      @change="clicTab"
      v-model="tabPosition"
      style="margin-bottom: 30px"
    >
      <el-radio-button
        :label="item.val"
        v-for="(item, index) in details"
        :key="index"
        >{{ item.la }}</el-radio-button
      >
    </el-radio-group>
    <!-- {{ tabPosition }} -->
    <div class="con-nr" v-if="tabPosition == 'details_single'">
      <el-table border :data="dishArr">
        <el-table-column label="序号" align="center" type="index" width="50" />

        <el-table-column label="名称" align="center" prop="typeName">
        </el-table-column>

        <el-table-column label="规格" align="center" prop="specName">
        </el-table-column>

        <el-table-column label="单位" align="center" prop="brandName">
        </el-table-column>
        <el-table-column label="数量" align="center" prop="num">
        </el-table-column>
        <el-table-column
          label="创建时间"
          align="center"
          prop="createTime"
          width="100"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="con-nr" v-else-if="tabPosition == 'package'">
      <!-- v-show="dishArr[item.val].length>0" -->
      <el-card
        class="box-card"
        v-for="(item, index) in packageArr"
        :key="index"
        v-show="packageDishArr[item.val].length > 0"
      >
        <div slot="header" class="clearfix">
          <span>{{ item.tit }}</span>
        </div>
        <el-table border :data="packageDishArr[item.val]">
          <el-table-column
            label="序号"
            align="center"
            type="index"
            width="50"
          />

          <el-table-column label="名称" align="center" prop="name">
          </el-table-column>

          <el-table-column label="数量" align="center" prop="num">
          </el-table-column>
          <el-table-column label="备注" align="center" prop="remark">
          </el-table-column>

          <!-- <el-table-column
            label="创建时间"
            align="center"
            prop="createTime"
            width="100"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
            </template>
          </el-table-column> -->
        </el-table>
      </el-card>
    </div>
    <div class="con-nr" v-else>
      <el-card class="box-card" v-for="(item, index) in dishArr" :key="index">
        <div slot="header" class="clearfix">
          <span>{{ item.name }}</span>
        </div>
        <el-table border :data="item.details">
          <el-table-column
            label="序号"
            align="center"
            type="index"
            width="50"
          />

          <el-table-column label="名称" align="center" prop="typeName">
          </el-table-column>

          <el-table-column label="数量" align="center" prop="num">
          </el-table-column>
          <el-table-column label="单位" align="center" prop="specName">
          </el-table-column>

          <el-table-column
            label="创建时间"
            align="center"
            prop="createTime"
            width="100"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
            </template>
          </el-table-column>
        </el-table>
      </el-card>
    </div>
  </div>
</template>
    
    <script>
import { getDoseInfoManage } from "@/api/system/dose_manage";
export default {
  props: {
    orderId: {
      type: String,
      default: "",
    },
  },
  // components: { addMenu },
  name: "record",
  dicts: ["sys_menus_status", "sys_menus_menus"],
  data() {
    return {
      tabPosition: "details_morning",
      activeName: "0",
      loading: true,
      menusList: [],
      details: [
        {
          la: "早餐",
          val: "details_morning",
        },
        {
          la: "午餐",
          val: "details_noon",
        },
        {
          la: "晚餐",
          val: "details_evening",
        },
        {
          la: "单品",
          val: "details_single",
        },
      ],
      dishArr: [], //菜谱列表
      packageDishArr: {},
      packageArr: [
        {
          tit: "早餐",
          val: "details_morning",
        },
        {
          tit: "午餐",
          val: "details_noon",
        },
        {
          tit: "晚餐",
          val: "details_evening",
        },
      ],
      schoolTag: 0, //0小学 1初中
      recordArr: [
        // {
        //   weekDate: null,
        //   week: null,
        //   details_noon: [],
        //   details_morning: [],
        //   details_evening: [],
        //   details_single: [],
        //   details_single: [],
        // },
      ],
    };
  },
  created() {
    var weekDay = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
    weekDay.forEach((item, index) => {
      this.recordArr.push({
        weekDate: item,
        week: null,
        details_noon: [], //午餐列表
        details_morning: [], //早餐列表
        details_evening: [], //晚餐列表
        package: [], //套餐
      });
    });
    this.show();
    // console.log(this.getWeek('2024-09-09'))
    // Number(process.env.VUE_APP_TIAN)

    // var today = new Date();
    // var now = new Date(
    //   today.getFullYear(),
    //   today.getMonth(),
    //   today.getDate() + 2
    // );

    // var weekDay = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
    // var firstDay = new Date(
    //   now.setDate(now.getDate() - now.getDay() + (now.getDay() === 0 ? -6 : 1))
    // );
    // console.log(firstDay);
  },
  methods: {
    show() {
      var weekDay = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
      getDoseInfoManage({ id: this.orderId }).then((response) => {
        // this.recordArr
        this.schoolTag = response.data.schoolTag;
        if (response.data.schoolTag == 0) {
          this.tabPosition = "package";
          this.details = [
            {
              la: "套餐",
              val: "package",
            },
            {
              la: "单品",
              val: "details_single",
            },
          ];
        }
        response.data.details.forEach((item, index) => {
          var week = this.getWeek(item.week);
          item.package = [];
          if (week == "周一") {
            item.weekDate = week;
            // package
            this.recordArr[0] = item;
            // this.recordArr[0].package = [];
            if (response.data.schoolTag == 0) {
              this.packageDishArr = this.recordArr[this.activeName];
            } else {
              this.dishArr = item["details_morning"];
            }

            console.log(this.dishArr);
          } else if (week == "周二") {
            item.weekDate = week;
            this.recordArr[1] = item;
          } else if (week == "周三") {
            item.weekDate = week;
            this.recordArr[2] = item;
          } else if (week == "周四") {
            item.weekDate = week;
            this.recordArr[3] = item;
          } else if (week == "周五") {
            item.weekDate = week;
            this.recordArr[4] = item;
          } else if (week == "周六") {
            item.weekDate = week;
            this.recordArr[5] = item;
          } else if (week == "周日") {
            item.weekDate = week;
            this.recordArr[6] = item;
          }
        });
        this.loading = false;
        console.log(this.recordArr);
      });
    },
    //监听 早中晚
    clicTab(e) {
      console.log(e);
      // console.log(this.activeName);
      this.tabPosition = e;
      if (e == "package") {
        this.packageDishArr = this.recordArr[this.activeName];
      } else {
        this.dishArr = this.recordArr[this.activeName][e];
      }
      // console.log(this.dishArr);
      // this.dishArr = item['details_morning']
    },
    //切换日期
    handleClick(e, a) {
      this.activeName = e.name + "";
      this.schoolTag == 0
        ? (this.tabPosition = "package")
        : (this.tabPosition = "details_morning");
        
      if (this.schoolTag == 0) {
        this.packageDishArr = this.recordArr[this.activeName];
      } else {
        this.dishArr = this.recordArr[this.activeName][this.tabPosition];
      }
    },
  },
};
</script>
<style rel="stylesheet/scss" lang="scss">
.con-nr {
  height: 60vh;
  width: 100%;
  overflow: auto;
}
.box-card {
  margin-bottom: 20px;
}
</style>
    